﻿<%@ page language="java" import="com.newcrm.config.Const,com.newcrm.util.Util,com.newcrm.bean.*,java.util.List,java.util.Map" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
  List<Map<String, Object>> taskCategorys = (List<Map<String, Object>>)request.getAttribute("taskCategory");
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>任务分类管理</title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <meta name="renderer" content="webkit"/>
  <meta http-equiv="X-UA-Compatible" content="IE=Edge">
  <link rel="shortcut icon" href="<%=request.getContextPath()%>/images/qikebao.ico" />
  <link rel="stylesheet" href="<%=request.getContextPath()%>/css/all.css?ver=<%=Const.VERSION%>">
  <link rel="stylesheet" href="<%=request.getContextPath()%>/css/font-awesome/css/font-awesome.min.css">
  <link rel="stylesheet" href="<%=request.getContextPath()%>/css/datepicker.css" />
  <link rel="stylesheet" href="<%=request.getContextPath()%>/css/bootstrap-datetimepicker.min.css" />
  <link rel="stylesheet" href="<%=request.getContextPath()%>/css/magnific-popup.css">
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/jquery-1.11.1.min.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/bootstrap.min.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/jquery-ui.min.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/jquery.bootstrap-growl.min.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/moment.min.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/bootstrap-datepicker.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/bootstrap-datetimepicker.min.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/daterangepicker.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/jquery.magnific-popup.min.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/jquery.cookie.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/popbox.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/common.js?ver=<%=Const.VERSION%>"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/taskCategory.js?ver=<%=Const.VERSION%>"></script>
</head>
<body class="parties">
  <jsp:include page="topNavi.jsp" flush="true"/>
  <div class="main-page">
    <table>
    <tr>
      <td class="main-body">
        <div class="topnavi">
          <div class='leftMenu'><span>任务分类管理</span></div>
        </div>
        <div class="grid">
          <div class="new">
            <form class="new" method="post" >
              添加新的任务分类<br />
              <input autocomplete="off" class="name" maxlength="25" id="categoryName" size="30" type="text" value="" />
              <span id="new_submit" class="submit"> <a id="new-link" class="button small blue" href="#"><i class="fa fa-plus"></i> 添加</a></span>
            </form>
          </div>
          <ul class="items ui-sortable" id="itemlist"><%
          if (taskCategorys != null) {
              for (Map<String, Object> category:taskCategorys) {
                String color = (String)category.get("Color");
                if (color == null || color.trim().length() == 0) {
                  color = "000000";
                }%>
            <li class="item" id="ID_<%=category.get("TaskCategoryId")%>">
              <div class="edit">
                <form class="edit_category" method="post" id="<%=category.get("TaskCategoryId")%>">
                  <div class="edit_swatch menu_container">
                    <a href="#" class="menu_target">
                      <span class="selected_color_swatch color_swatch" color="<%=color%>" style="background-color: #<%=color%>"></span>
                      <span class="arrow"><i class="fa fa-caret-down"></i></span>
                    </a>
                    <ul class="picker menu_content" style="display: none;">
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="c50000">
                        <span class="color_swatch" style="background: #c50000;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="ec61a2">
                        <span class="color_swatch" style="background: #ec61a2;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="650606">
                        <span class="color_swatch" style="background: #650606;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="f55c00">
                        <span class="color_swatch" style="background: #f55c00;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="a5460d">
                        <span class="color_swatch" style="background: #a5460d;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="666666">
                        <span class="color_swatch" style="background: #666666;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="ff9c00">
                        <span class="color_swatch" style="background: #ff9c00;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="b3a543">
                        <span class="color_swatch" style="background: #b3a543;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="482a15">
                        <span class="color_swatch" style="background: #482a15;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="009900">
                        <span class="color_swatch" style="background: #009900;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="3b9e93">
                        <span class="color_swatch" style="background: #3b9e93;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="2c5322">
                        <span class="color_swatch" style="background: #2c5322;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="000099">
                        <span class="color_swatch" style="background: #000099;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="3185c5">
                        <span class="color_swatch" style="background: #3185c5;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="46647c">
                        <span class="color_swatch" style="background: #46647c;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="660099">
                        <span class="color_swatch" style="background: #660099;"></span>
                      </a>
                    </li>
                    <li class="">
                      <a href="#" class="menu_action" data-menuvalue="e207c1">
                        <span class="color_swatch" style="background: #e207c1;"></span>
                      </a>
                    </li>
                    <li class="selected">
                      <a href="#" class="menu_action" data-menuvalue="000000">
                        <span class="color_swatch" style="background: #000000;"></span>
                      </a>
                    </li>
                    </ul>
                  </div>
                  <div><input autocomplete="off" maxlength="25" class="name" size="30" type="text" value="<%=Util.HTMLEncode((String)category.get("TaskCategoryName"))%>" /></div>
                  <span class="submit">
                    <a class="button small blue" href="<%=category.get("TaskCategoryId")%>"><i class="fa fa-pencil"></i> 修改</a>
                    <a class="admin" href="#">取 消</a>
                  </span>
                </form>
              </div>
              <div class="show">
                <form class="submit_on_change" method="post" id="<%=category.get("TaskCategoryId")%>">
                  <div class="edit_swatch menu_container">
                    <a href="#" class="menu_target">
                      <span class="selected_color_swatch color_swatch" color="<%=color%>" style="background-color: #<%=color%>"></span>
                      <span class="arrow"><i class="fa fa-caret-down"></i></span>
                    </a>
                    <ul class="picker menu_content" style="display: none;">
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="c50000">
                          <span class="color_swatch" style="background: #c50000;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="ec61a2">
                          <span class="color_swatch" style="background: #ec61a2;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="650606">
                          <span class="color_swatch" style="background: #650606;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="f55c00">
                          <span class="color_swatch" style="background: #f55c00;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="a5460d">
                          <span class="color_swatch" style="background: #a5460d;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="666666">
                          <span class="color_swatch" style="background: #666666;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="ff9c00">
                          <span class="color_swatch" style="background: #ff9c00;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="b3a543">
                          <span class="color_swatch" style="background: #b3a543;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="482a15">
                          <span class="color_swatch" style="background: #482a15;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="009900">
                          <span class="color_swatch" style="background: #009900;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="3b9e93">
                          <span class="color_swatch" style="background: #3b9e93;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="2c5322">
                          <span class="color_swatch" style="background: #2c5322;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="000099">
                          <span class="color_swatch" style="background: #000099;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="3185c5">
                          <span class="color_swatch" style="background: #3185c5;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="46647c">
                          <span class="color_swatch" style="background: #46647c;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="660099">
                          <span class="color_swatch" style="background: #660099;"></span>
                        </a>
                      </li>
                      <li class="">
                        <a href="#" class="menu_action" data-menuvalue="e207c1">
                          <span class="color_swatch" style="background: #e207c1;"></span>
                        </a>
                      </li>
                      <li class="selected">
                        <a href="#" class="menu_action" data-menuvalue="000000">
                          <span class="color_swatch" style="background: #000000;"></span>
                        </a>
                      </li>
                    </ul>
                  </div>
                </form>
                <div class="name"><%=Util.HTMLEncode((String)category.get("TaskCategoryName"))%></div>
                <ul class="controls">
                  <li><a class="admin" href="#">修改</a></li>
                  <li><a title="删除分类" class="delete" href="<%=category.get("TaskCategoryId")%>"><i class="fa fa-trash-o"></i> &nbsp;</a></li>
                </ul>
              </div>
            </li>
            <%
              }
            }
            %>
          </ul>
        </div>
      </td>
      <td class="main-sidebar">
        <div class="content">
          <div class="liner">
            <div class="sidebox closedbox">
              <h5>任务分类</h5>
              <p>可以对创建的任务进行分类，方便管理。</p>
            </div>
          </div>
        </div>
      </td>
    </tr>
    </table>
  </div>

  <li class="item" id="clone" style="display:none;">
    <div class="edit">
      <form class="edit_category" method="post">
        <div class="edit_swatch menu_container">
          <a href="#" class="menu_target">
            <span class="selected_color_swatch color_swatch" color="000000" style="background-color: #000000"></span>
            <span class="arrow"><i class="fa fa-caret-down"></i></span>
          </a>
          <ul class="picker menu_content" style="display: none;">
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="c50000">
              <span class="color_swatch" style="background: #c50000;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="ec61a2">
              <span class="color_swatch" style="background: #ec61a2;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="650606">
              <span class="color_swatch" style="background: #650606;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="f55c00">
              <span class="color_swatch" style="background: #f55c00;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="a5460d">
              <span class="color_swatch" style="background: #a5460d;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="666666">
              <span class="color_swatch" style="background: #666666;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="ff9c00">
              <span class="color_swatch" style="background: #ff9c00;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="b3a543">
              <span class="color_swatch" style="background: #b3a543;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="482a15">
              <span class="color_swatch" style="background: #482a15;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="009900">
              <span class="color_swatch" style="background: #009900;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="3b9e93">
              <span class="color_swatch" style="background: #3b9e93;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="2c5322">
              <span class="color_swatch" style="background: #2c5322;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="000099">
              <span class="color_swatch" style="background: #000099;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="3185c5">
              <span class="color_swatch" style="background: #3185c5;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="46647c">
              <span class="color_swatch" style="background: #46647c;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="660099">
              <span class="color_swatch" style="background: #660099;"></span>
            </a>
          </li>
          <li class="">
            <a href="#" class="menu_action" data-menuvalue="e207c1">
              <span class="color_swatch" style="background: #e207c1;"></span>
            </a>
          </li>
          <li class="selected">
            <a href="#" class="menu_action" data-menuvalue="000000">
              <span class="color_swatch" style="background: #000000;"></span>
            </a>
          </li>
          </ul>
        </div>
        <div><input autocomplete="off" maxlength="25" class="name" size="30" type="text" value="" /></div>
        <span class="submit">
          <a class="button small blue" href="#"><i class="fa fa-pencil"></i> 修改</a>
          <a class="admin" href="#">取 消</a>
        </span>
      </form>
    </div>
    <div class="show">
      <form class="submit_on_change" method="post" id="">
        <div class="edit_swatch menu_container">
          <a href="#" class="menu_target">
            <span class="selected_color_swatch color_swatch" color="000000" style="background-color: #000000"></span>
            <span class="arrow"><i class="fa fa-caret-down"></i></span>
          </a>
          <ul class="picker menu_content" style="display: none;">
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="c50000">
                <span class="color_swatch" style="background: #c50000;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="ec61a2">
                <span class="color_swatch" style="background: #ec61a2;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="650606">
                <span class="color_swatch" style="background: #650606;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="f55c00">
                <span class="color_swatch" style="background: #f55c00;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="a5460d">
                <span class="color_swatch" style="background: #a5460d;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="666666">
                <span class="color_swatch" style="background: #666666;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="ff9c00">
                <span class="color_swatch" style="background: #ff9c00;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="b3a543">
                <span class="color_swatch" style="background: #b3a543;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="482a15">
                <span class="color_swatch" style="background: #482a15;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="009900">
                <span class="color_swatch" style="background: #009900;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="3b9e93">
                <span class="color_swatch" style="background: #3b9e93;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="2c5322">
                <span class="color_swatch" style="background: #2c5322;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="000099">
                <span class="color_swatch" style="background: #000099;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="3185c5">
                <span class="color_swatch" style="background: #3185c5;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="46647c">
                <span class="color_swatch" style="background: #46647c;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="660099">
                <span class="color_swatch" style="background: #660099;"></span>
              </a>
            </li>
            <li class="">
              <a href="#" class="menu_action" data-menuvalue="e207c1">
                <span class="color_swatch" style="background: #e207c1;"></span>
              </a>
            </li>
            <li class="selected">
              <a href="#" class="menu_action" data-menuvalue="000000">
                <span class="color_swatch" style="background: #000000;"></span>
              </a>
            </li>
          </ul>
        </div>
      </form>
      <div class="name"></div>
      <ul class="controls">
        <li><a class="admin" href="#">修改</a></li>
        <li><a title="删除分类" class="delete" href="#"><i class="fa fa-trash-o"></i> &nbsp;</a></li>
      </ul>
    </div>
  </li>
</body>
</html>